<template>
  <div>
	  <myheader></myheader>

	<section class="featured-block text-center">
		<div class="container">

      <table>
         <tr>
          <td>商品分类</td>
          <td>
            <Select :datas='category' v-model="selected"></Select>
          </td>

        </tr>

        <tr>
          <td>商品名称</td>
          <td>
          <input type="text" v-model="name">
          </td>
        </tr>

  
          <td>商品价格</td>
          <!-- 进度条要和文件上传在一个标签里面 -->
          <td>
          <input type="number" v-model="price"> 
          </td>

          <tr>
          <td>颜色</td>
          <td>
            <input type="text" v-model="color">
          </td>
          </tr>

          <tr>
          <td>尺码</td>
          <td>
            <input type="text" v-model="size">
          </td>
          </tr>
          
          <tr>
          <td>季节</td>
          <td>
            <input type="text" v-model="season">
          </td>
          </tr>

          <td>
            <Button @click="submit">添加商品</Button>
          </td>




      </table>
			

		</div>
	</section>
	

	
	
	
	<footer class="footer">

		<div class="container">
			@v3u.cn
		</div>
		
		
	</footer>
    
</div>
  
</template>

<script>



//导入组件
import myheader from './myheader.vue'

export default {
  data () {
    return {
      //商品分类
      category:[],
      selected:'',
      name:"",
      size:'',
      price:0,
      color:'',
      season:'',
      //商品id和name
      goods_dict:{}



    }
  },
  components: {
    'myheader':myheader,
  },
  methods: {
    //获取商品分类
    get_category(){
      this.axios.get('http://localhost:8000/categorylist/')
      .then(a=>{
        //二次处理数据
        let mycate = []
        for(let i=0;i<a.data.dic.length;i++){
          mycate.push(a.data.dic[i]['name'])
          // this.goods_dict[a.data.dic[i]['']]
        }
        this.category=mycate

      })
    },

    //添加商品逻辑
    submit(){
      console.log(this.selected)
      // return false
      //将普通字段转换为json
      var param = {}
      param['color'] = this.color
      param['size'] = this.size
      param['season'] = this.season
      console.log(param)

      //json转化成字符串
      param = JSON.stringify(param)
      console.log(param)
      
      let data = new FormData()
      data.append('name',this.name)
      data.append('price',this.price)
      data.append('params',param)
      data.append('selected',this.selected)
      // console.log('这个数据',data.get("name"))
      // return false

      this.axios.post('http://localhost:8000/insertgoods/',data)
      .then(a=>{
        console.log(a)
        console.log(a.data.message)
      })
    }

    
  

  },
  mounted(){
    this.get_category()
  }
  
 
}


</script>
 
<style>
/* //标签选择器 */
td{
  padding: 10px
}
.imgcode{
  cursor: pointer;
}
/* id选择器 */
#upload{
  margin: 50px;
  width: 200;
  height: 150px;
  border: 2px dashed skyblue
}


</style>